<template>
  <div class="article_bg">
      <div class="content_top">
        <h4>{{article.a_title}}</h4>
      </div>
      <div class="content_main">
          <p>{{article.a_content}}</p>
      </div>
      
      <div class="content_footer">
            <span>{{adminName}}</span>
            <el-divider direction="vertical"></el-divider>
            {{article.a_createat | moment}}
      </div>
      
      
<!-- 使用冒号标记，当匹配到的时候，参数值会被设置到 this.$route.params 中 -->

  </div>
</template>

<script>
export default {
    data(){
        return{
            article:"",
            adminName:localStorage.getItem('adminName'),
            id:this.$route.params.id
            }
        
    },
    created(){
        this.getContent()
    },
    methods:{
        getContent(){
            this.$axios("/article/sel",{
                method:"post",
                data:`id=${this.id}`
            }).then(res=>{
                this.article = res.data[0]
                
            })

            // this.$axios.post('/article/sel',this.data).then(res=>{
            //     this.article = res.data[0]
            // })
        }
    }
}
</script>

<style>
body,
html{
    padding: 0;
    margin: 0;
}
.article_bg{
    background: url("../../assets/bg.jpg");
    display: flex;
    flex-direction: column;
}
.content_main{
    align-self: center;
}
.content_footer{
    align-self: flex-end;
    margin-right: 20px;
    font-size: 20px;
}
.content_top{
    margin-left: 20px;
    font-size: 20px;
}
h4{
    color:#409eff;
}

</style>